<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <script>
    // function Fn() {
      
    // }
    // console.log(Fn.prototype)
    // const fn = new Fn()
    // console.log(fn.__proto__)
    // console.log(Fn.prototype===fn.__proto__)

    /* 
    显式原型: 函数上的prototype属性
    隐式原型: 对象上的__proto__属性
    原型对象: 显式原型或隐式原型指向的对象, 它有一个constructor属性指向函数
    实例对象的隐式原型等于构造函数的显式原型: fn.__proto__ === Fn.prototype

    扩展: 
      我们定义的函数默认的原型对象是Object的实例

    原型链: 通过对象上的__proto__属性连接越来的所有对象组成的链
          Object原型对象的__proto__属性值为null, 它一般就是原型链的尽头
      作用: 查找对象属性
      过程: 先在对象自身上查找, 如果有返回, 如果没, 沿着原型链依次在原型对象上查找, 如果有返回, 如果没有返回undefined
      应用:
        Vue.prototype.$API = API  => 在组件中: this.$API  $API在组件的原型对象的原型对象上

    原型链的详图
      A instanceof B
    */

    // function Function() {}
    // function Object() {}

    function Fn() {
      
    }
    const f1 = new Fn()
    const f2 = new Fn()
    const o1 = {}
    const o2 = new Object()

    console.log(Function.prototype.__proto__ === Object.prototype)  // true
    console.log(Function.prototype) // 它是一个函数, 并不是Object的实例
    // 上面的判断为什么成立呢?
    // 内部自动建立: Function.prototype.__proto__ = Object.prototype

console.log(Function instanceof Function)
console.log(Function instanceof Object)
console.log(Object instanceof Function)
console.log(Object instanceof Object)
console.log(Fn instanceof Function)
console.log(Fn instanceof Object)
console.log(f1 instanceof Object)
console.log(f1 instanceof Function)

    /* 
    1. 所有函数都instanceof Function和Object
    2. 所有非Function的函数实例对象只instanceof Object, 不instanceof Functoin 
    A instanceof B : 如果B的ptototype指向的原型对象是A原型链上某个原型对象, 就是true
    */

  </script>
</body>
</html>